import React, { Component } from 'react';
import $ from 'jquery';
import Main from "./main.js"
import '../styles/App.css';
import '../iconfont/iconfont.css';
import TableStar from './tablestar';
import Jintian from './tblist/jintian';
import Mingtian from './tblist/mingtian';
import Toweek from './tblist/toweek';
import Tomonth from './tblist/tomonth';
import Toyear from './tblist/toyear';
import Header from './header';

import {HashRouter as Router,Route,Link} from 'react-router-dom';
import Xingzuo from "./xingzuo";
import Faxian from "./faxian";
import Starnews from "./starnews";
import Personal from "./personal";

var username = undefined;
const routes = [
  {
    path:"/main",
    component:Main,
    routes:[
      { path: '/main/xingzuo',
        component:Xingzuo
      },
      { path: '/main/faxian',
        component: Faxian
      },
      { path: '/main/starnews',
        component: Starnews
      },
      { path: '/main/personal',
        component: Personal
      }
    ]
  },{
  	path:"/tablestar",
  	component:TableStar,
  	routes:[
      { path: '/tablestar/jintian',
        component:Jintian
      },
      { path: '/tablestar/mingtian',
        component: Mingtian
      },
      { path: '/tablestar/toweek',
        component: Toweek
      },
      { path: '/tablestar/tomonth',
        component: Tomonth
      },
      { path: '/tablestar/toyear',
        component: Toyear
      }
    ]
  }
]

//这个组件是用来自动生成Route组件用的
const RouteTab = (route) => {
  return <Route path={route.path}  render={props => (
    // 把自路由向下传递来达到嵌套。
    <route.component {...props} routes={route.routes} cb={route.cb?route.cb:undefined} username={username}/>
  )}/>
}

const App = () => (
  <Router>
    <div className='mainWrap'>
      {routes.map((route, i) => {
        return <RouteTab key={i} {...route}/>
      })}
    </div>
  </Router>
)

export default App;